<div nz-row [nzGutter]="16">
    <div nz-col nzSpan="6">
        <nz-spin [nzSpinning]="profileLoading">
            <nz-card nzTitle="个人信息" nzSize="small">
                <div class="avatar-container">
                    <div class="avatar-container-circle" (click)="updateAvatar()">
                        <img [src]="avatar" />
                        <span class="avatar-container-plus" nz-icon nzType="plus" nzTheme="outline"></span>
                    </div>
                </div>
                <nz-divider></nz-divider>
                <div class="item-container">
                    <div class="item-title">用户名称</div>
                    <div class="item-context">{{ userProfileInfo?.user?.userName }}</div>
                </div>
                <nz-divider></nz-divider>
                <div class="item-container">
                    <div class="item-title">手机号码</div>
                    <div class="item-context">{{ userProfileInfo?.user?.phonenumber }}</div>
                </div>
                <nz-divider></nz-divider>
                <div class="item-container">
                    <div class="item-title">用户邮箱</div>
                    <div class="item-context">{{ userProfileInfo?.user?.email }}</div>
                </div>
                <nz-divider></nz-divider>
                <div class="item-container">
                    <div class="item-title">所属部门</div>
                    <div class="item-context" *ngIf="userProfileInfo?.user?.dept"
                        >{{ userProfileInfo?.user?.dept?.deptName }}/{{ userProfileInfo?.postGroup }}</div
                    >
                </div>
                <nz-divider></nz-divider>
                <div class="item-container">
                    <div class="item-title">所属角色</div>
                    <div class="item-context">{{ userProfileInfo?.roleGroup }}</div>
                </div>
                <nz-divider></nz-divider>
                <div class="item-container">
                    <div class="item-title">创建日期</div>
                    <div class="item-context">{{ userProfileInfo?.user?.createTime }}</div>
                </div>
            </nz-card>
        </nz-spin>
    </div>
    <div nz-col nzSpan="18">
        <nz-spin [nzSpinning]="profileLoading">
            <nz-card nzTitle="基本资料" nzSize="small">
                <nz-tabset nzSize="small">
                    <nz-tab nzTitle="基本资料">
                        <sf #baseInfo [schema]="updateProfileSchema" autocomplete="off" [formData]="updateProfileItem" button="none">
                            <div style="padding-left: 90px">
                                <button
                                    nz-button
                                    type="submit"
                                    [nzType]="'primary'"
                                    (click)="updateUserProfile(baseInfo.value)"
                                    [disabled]="!baseInfo.valid"
                                    [nzLoading]="loading"
                                >
                                    保存
                                </button>
                                <button nz-button type="button" [nzType]="'primary'" nzDanger (click)="baseInfo.reset(); closePage()"
                                    >关闭</button
                                >
                            </div>
                        </sf>
                    </nz-tab>
                    <nz-tab nzTitle="修改密码">
                        <sf
                            #passWord
                            [schema]="updatePassWordSchema"
                            autocomplete="off"
                            (formValueChange)="passwordValueChange($event)"
                            button="none"
                        >
                            <div style="padding-left: 90px">
                                <button
                                    nz-button
                                    type="submit"
                                    [nzType]="'primary'"
                                    (click)="updatePassWord(passWord.value)"
                                    [disabled]="!passWord.valid"
                                    [nzLoading]="loading"
                                >
                                    保存
                                </button>
                                <button nz-button type="button" [nzType]="'primary'" nzDanger (click)="passWord.reset(); closePage()"
                                    >关闭</button
                                >
                            </div>
                        </sf>
                    </nz-tab>
                </nz-tabset>
            </nz-card>
        </nz-spin>
    </div>
</div>
